<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

<!-- Begin Jekyll SEO tag v2.8.0 -->
<title>超星学习通章节文件下载 | blog</title>
<meta name="generator" content="Jekyll v3.9.2" />
<meta property="og:title" content="超星学习通章节文件下载" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="大学学习生活中, 经常会需要使用到学习通. 出于各种原因, 上传到学习通 “章节” 里的文件并不总是具备下载按钮. 对于这种情况, 本文尝试介绍一种可用的下载方法." />
<meta property="og:description" content="大学学习生活中, 经常会需要使用到学习通. 出于各种原因, 上传到学习通 “章节” 里的文件并不总是具备下载按钮. 对于这种情况, 本文尝试介绍一种可用的下载方法." />
<link rel="canonical" href="https://tsagaanbar.gitee.io/blog/hack/chaoxing-chapter-file-download/" />
<meta property="og:url" content="https://tsagaanbar.gitee.io/blog/hack/chaoxing-chapter-file-download/" />
<meta property="og:site_name" content="blog" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2022-05-02T23:22:35+00:00" />
<meta name="twitter:card" content="summary" />
<meta property="twitter:title" content="超星学习通章节文件下载" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","dateModified":"2022-05-02T23:22:35+00:00","datePublished":"2022-05-02T23:22:35+00:00","description":"大学学习生活中, 经常会需要使用到学习通. 出于各种原因, 上传到学习通 “章节” 里的文件并不总是具备下载按钮. 对于这种情况, 本文尝试介绍一种可用的下载方法.","headline":"超星学习通章节文件下载","mainEntityOfPage":{"@type":"WebPage","@id":"https://tsagaanbar.gitee.io/blog/hack/chaoxing-chapter-file-download/"},"url":"https://tsagaanbar.gitee.io/blog/hack/chaoxing-chapter-file-download/"}</script>
<!-- End Jekyll SEO tag -->

    <link rel="stylesheet" href="/blog/assets/css/style.css?v=5a3a055c96aa4035d7a987d1ed733ff6fc09a8b3">
    <!-- start custom head snippets, customize with your own _includes/head-custom.html file -->

<!-- Setup Google Analytics -->



<!-- You can set your favicon here -->
<!-- link rel="shortcut icon" type="image/x-icon" href="/blog/favicon.ico" -->

<!-- end custom head snippets -->

  </head>
  <body>
    <div class="container-lg px-3 my-5 markdown-body">
      <p><a href="https://tsagaanbar.gitee.io/blog/">tsagaanbar's Blog</a></p>
      
      <h1>超星学习通章节文件下载</h1>

      <h2 id="背景">背景</h2>

<p>在 MUC 的学习生活中, 经常会需要使用到学习通.</p>

<p>有些老师会将课程 PPT 上传到学习通的 “章节” 中. 但是, 出于各种原因 (主观上不情愿或者客观上不会操作), 并不是所有老师都会开启这些文件的下载功能. (注意, “章节” 有时候又称 “任务点”, 区别于课程的 “资料” 板块).</p>

<p>而作为学生的我们, 出于各种原因, 有时候又需要下载这些文件来查看 (学习通网页上对文件的预览并不好用), 比如打印出来, 或者存储在个人设备上便于批注和查阅.</p>

<p>网上流传了很多方法, 主流的方式大多是提取出 <code class="language-plaintext highlighter-rouge">objectId</code> 并替换到某个 URL 中, 访问即可下载. 但是这些方法大多已经失效, 访问时提示 “403 Forbidden”.</p>

<p>对此, 笔者认为的 <strong>可能</strong> 的原因是权限校验失败. 用户粘贴 URL 到浏览器地址栏中访问, 便丢失了先前的对话环境, 服务器无法鉴别身份, 便拒绝提供下载功能. 而之前泄露出来可用的 URL 也许只是超星方面忘记了设定身份校验.</p>

<p>于是便尝试在同一个网页环境中完成链接的点击.</p>

<p>道理是这样, 但是笔者一直没有得以成功实现.</p>

<h2 id="契机">契机</h2>

<p>正巧, 最近笔者的好友分享了超星云盘上的文件, 奈何页面上并没有下载按钮. 在不想麻烦朋友的情况下, 同时出于对国内一众网页开发技术的了解 (混乱代码 + 客户端渲染), 直接就点开了 “开发人员工具”, 尝试对页面进行分析.</p>

<p>很快, 通过顺藤摸瓜的方式:</p>

<ul>
  <li>先找到网页上可能出现下载按钮的位置 / 对网页上现有的元素进行检索</li>
  <li>再搜索可疑的关键字, 比如 <code class="language-plaintext highlighter-rouge">download</code> 或者 <code class="language-plaintext highlighter-rouge">file</code> 之类的单词</li>
</ul>

<p>便发现了网页源代码中明文内嵌的一段 JavaScript 代码.</p>

<p>观察这段代码, 可以发现这段代码:</p>

<ul>
  <li>声明了一个包含文件属性信息的 JSON 对象, 其中一个属性就是 <code class="language-plaintext highlighter-rouge">download</code>, 其值为一个 URL</li>
  <li>然后将一个回调函数绑定在了页面上的 <code class="language-plaintext highlighter-rouge">#download</code> 元素上.</li>
</ul>

<p>虽然页面上没有找到这个元素, 可是这个回调函数里的代码还是可以执行一下试试.</p>

<p>这段代码大概完成的事情就是:</p>

<ul>
  <li>创建一个 <code class="language-plaintext highlighter-rouge">&lt;a&gt;</code> 元素</li>
  <li>将其 <code class="language-plaintext highlighter-rouge">href</code> 属性设置为上面提到的 URL</li>
  <li>再将 <code class="language-plaintext highlighter-rouge">target</code> 属性设置为 <code class="language-plaintext highlighter-rouge">_self</code></li>
  <li>最后再模拟点击</li>
</ul>

<p>结果就是, 执行了上述代码, 浏览器就弹出了文件下载的窗口.</p>

<blockquote>
  <p>有一些细节: 一是需要根据页面所使用的协议对这个 URL 的协议头进行替换, 一般需要替换成 <code class="language-plaintext highlighter-rouge">https</code>; 二是这个 URL 除了 <code class="language-plaintext highlighter-rouge">objectId</code> 还包含了 <code class="language-plaintext highlighter-rouge">at_</code>, <code class="language-plaintext highlighter-rouge">ak_</code>, <code class="language-plaintext highlighter-rouge">ad_</code> 等参数 (大概是用来限制文件的下载, 这些参数动态生成, 参数必须合法才能下载文件), 如果缺失这些参数则是无法下载文件的.</p>
</blockquote>

<p>毕竟笔者没有什么 WEB 开发经验, 也没有深入研究超星的技术, 所以不清楚具体为什么同样的链接, 直接访问未果, 而在控制台里这样操作就可以成功下载.</p>

<h2 id="延申">延申</h2>

<p>在笔者为了这次的问题查阅资料的过程中, 也看到了其他资料, 但是主要是和章节文件下载相关的.</p>

<p>事成之后, 笔者觉得这些问题之间有一定联系, 便准备将这次经历分享出来, 帮助需要的读者.</p>

<p>在 <a href="https://www.zhihu.com/question/448827791">超星学习通如何下载文件 - 知乎</a> 这个问题下有个 <a href="https://www.zhihu.com/question/448827791/answer/2224124911">回答</a>, 提供了一种较为简单直观的下载超星学习通章节任务点中文件的方法. 回答的评论下也有用户转发了一篇 <a href="https://blog.csdn.net/BingTaiLi/article/details/112535274">CSDN 上的博客</a>, 同样介绍了类似的方法.</p>

<blockquote>
  <p>问题下的 <a href="https://www.zhihu.com/question/448827791/answer/1783365679">另一个回答</a> 给出的是类似的方式, 不过看起来就没那么直观.</p>
</blockquote>

<p>这个方法大概是, 检视超星加载页面时产生的网络请求, 之后找到一个请求项 (其实就是对 <code class="language-plaintext highlighter-rouge">https://mooc1-1.chaoxing.com/ananas/status/&lt;objectid&gt;?flag=normal</code> 的访问), 其返回的信息是一个 JSON 对象.</p>

<p>对象中主要用到的有 <code class="language-plaintext highlighter-rouge">download</code> 和 <code class="language-plaintext highlighter-rouge">pdf</code> 这两个属性值:</p>

<ul>
  <li><code class="language-plaintext highlighter-rouge">download</code> 属性对应的 URL 如果直接访问会提示 “403 Forbidden”</li>
  <li>而 <code class="language-plaintext highlighter-rouge">pdf</code> 属性对应的 URL 的目前仍能够直接访问</li>
</ul>

<p>笔者猜测, <code class="language-plaintext highlighter-rouge">pdf</code> 属性值给出的 URL 对应的是源文件转换而来的 PDF 文件, 而该 API 目前仍未被超星封锁, 因此尚能访问.</p>

<p>而笔者发现, 使用本文 <a href="#契机">“契机”</a> 部分介绍的方式后, 访问 <code class="language-plaintext highlighter-rouge">download</code> 对应的 URL 仍然是可以下载到文件的.</p>

<h2 id="方法">方法</h2>

<p>这里重申一次整个流程, 建议参考 <a href="https://blog.csdn.net/BingTaiLi/article/details/112535274">前文提到的博客</a>, 大致如下:</p>

<ul>
  <li>进入页面, 打开开发者工具, 进入 “网络 (Network)” 选项卡</li>
  <li>刷新页面, 检视网页对 <code class="language-plaintext highlighter-rouge">https://mooc1-1.chaoxing.com/ananas/status/&lt;objectid&gt;?flag=normal</code> 的访问请求 (可以筛选 <code class="language-plaintext highlighter-rouge">XHR</code> 类别下的请求)</li>
  <li>预览 (Preview) 该请求, 查看到对应的内容 (或者手动模拟请求, 但是需要有相应的权限)</li>
  <li>得到一个 JSON 对象, 获取其中 <code class="language-plaintext highlighter-rouge">download</code> 属性的值, 应为一个具有 <code class="language-plaintext highlighter-rouge">at_</code>, <code class="language-plaintext highlighter-rouge">ak_</code>, <code class="language-plaintext highlighter-rouge">ad_</code> 等参数的 URL</li>
  <li>在控制台中创建一个 HTML <code class="language-plaintext highlighter-rouge">&lt;a&gt;</code> 元素, 其 <code class="language-plaintext highlighter-rouge">href</code> 属性为上一步获得的 URL, 需注意替换协议头
    <div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code>  <span class="nx">e</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">createElement</span><span class="p">(</span><span class="dl">'</span><span class="s1">a</span><span class="dl">'</span><span class="p">)</span>
  <span class="nx">e</span><span class="p">.</span><span class="nx">href</span> <span class="o">=</span> <span class="dl">'</span><span class="s1">...</span><span class="dl">'</span>  <span class="c1">// download 处给出的 URL, 需注意替换协议头</span>
  <span class="nx">e</span><span class="p">.</span><span class="nx">target</span> <span class="o">=</span> <span class="dl">'</span><span class="s1">_self</span><span class="dl">'</span>
</code></pre></div>    </div>
  </li>
  <li>模拟点击这个 <code class="language-plaintext highlighter-rouge">&lt;a&gt;</code> 元素
    <div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code>  <span class="nx">e</span><span class="p">.</span><span class="nx">click</span><span class="p">()</span>
</code></pre></div>    </div>
  </li>
</ul>

<h2 id="小结">小结</h2>

<p>总之, 很多时候 WEB 相关的问题 (比如获取页面所加载的资源, 获取页面展示信息所使用的 API 等等) 都可以通过检视 (Inspect) 网页的源代码 (HTML + CSS + JavaScript), 最终渲染出来的元素, 以及过程中的网络请求等解决.</p>

<p>比如这次问题中的 “学习通章节文件下载”, 除非学习通在服务器端将文件截图渲染好再递交给用户, 不然用户总是需要下载文件本身, 且用户总是可以检视这个过程, 以得到相应的文件.</p>

<p>就算是学习通在服务器端渲染好文件 (且不说这会给学习通服务器带来多少压力), 我们也总是可以找到唯一标识这个文件的 ID, 并通过一定的 API 获取到这个文件的下载地址. 更何况, 超星目前的网站 (以及其他很多网站) 上代码繁复冗杂, 风格各异, 也许总能从其中找到切入点.</p>


      
    </div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/anchor-js/4.1.0/anchor.min.js" integrity="sha256-lZaRhKri35AyJSypXXs4o6OPFTbTmUoltBbDCbdzegg=" crossorigin="anonymous"></script>
    <script>anchors.add();</script>
  </body>
</html>
